<script src="../../unpackage/dist/build/web/static/js/chunk-vendors.667503ce.js"></script>
<template>
	<view class="content">
		<iframe allow="camera *;microphone *; display-capture" allowfullscreen="true" border="0" v-if="isVideoLive" webkitallowfullscreen="true" mozallowfullscreen="true" :src="url" frameborder="0" width="100%" height="100%"></iframe>
		<!-- <view class="back" @click="onBack">
			<tui-icon name="home-fill" :size="34" color="#999"></tui-icon>
		</view>
		<view class="back" @click="qiandao" style="bottom: 46vh;right: 30rpx;z-index: 999999;">
			<image src="/web/static/qiandao_1.png" mode="" style="width: 100rpx;height: 100rpx;"></image>
		</view> -->
		<tui-login :show="show"  @close="guanbi"></tui-login>
		<!-- <view class="zhuanpan" v-if="isChoujiang">
			<l-dialer :prizeList="prizeList" @click="onClick" @done="onDone" ref="dialer" />
			<view class="flex flex-align flex-center" style="margin-top: 30rpx;">
				<tui-icon name="close-fill" :size="50" color="#f20" @click="closeCj"></tui-icon>
			</view>
		</view> -->
		<tui-orderDetail ref="tOrderDetail" @finish='finish' :show="isShow" :id="id" @close="isShow=false"></tui-orderDetail>
		<tui-ConfirmOrder ref="tConfirmOrder" @finish='cfmfinish' :show="cjshow"  @close="cjshow=false"></tui-ConfirmOrder>
		<tui-PayResult ref="tPayResult" @finish='payfinish' :zhifu="zhifu" :show="payshow"  @close="payshow=false"></tui-PayResult>
		<tui-OrderList ref="tOrderList" :show="dingdanshow"  @close="dingdanshow=false"></tui-OrderList>
	</view>
</template>
<script>
	export default {
		data() {
			return {
				isPlaySource: false, //是否有播放源
				isVideoLive: false, //是否是直播
				isAutoplay: true, //是否自动播放
				videoMsg: '', //video消息
				currentUrl: '', //播放路径
				showControlbar: true,
				timer:null,
				url:'',
				image:'',
				id:'',
				course_name:'',
				show:false,
				isChoujiang:false,
				duration: {
					startTime: 0, // 抽奖开始时间
					endTime: 0, // 抽奖结束时间
				},
				intervalId: null, // 用于存储定时器的ID，‌以便后续可以清除定时器
				prizeList: [
					
				],
				ticket_id:'',
				yaoqing:'',
				isShow:false,
				cjshow:false,
				payshow:false,
				zhifu:'',
				zhishow:false,
				zhiurl:'',
				dingdanshow:false
			}
		},

		onLoad(e) {
			let that = this
			that.yaoqing = e.yaoqing
			if(that.tui.isLogin()){
				that.id=e.zhiboid
				that.getList()
				that.getJianting()
			}else{
				uni.setStorageSync('refCode', e.inviter_code)
				uni.setStorageSync('zhiboid', e.zhiboid)
				uni.redirectTo({
					url: '/pages/login/login'
				})
			}
			
			// this.url =uni.getStorageSync('zhiboUrl')
		},
		// #ifdef MP
		onShareAppMessage() {
			return {
				title:'分享海报',
				path:'/pages/home/home?inviter_code='+uni.getStorageSync('inviter_code')+'&zhiboid='+this.id,
				imageUrl:this.image||'/static/logo.jpg'
			};
		},
		// #endif
		onShow() {
			let that = this
			that.isVideoLive = true
			if(that.tui.isLogin()){
				// that.startPolling()
				that.tui.TongjiLive(1, this.id)
				let url = "wss://socket-shop.zzcyx1688.cn/admin/orderSocket/connect?project_name=live34&token="+uni.getStorageSync("d_token")+"&scene=turntable"
				// that.socketIo.connectSocketInit(url)
			}
			uni.$off('getPositonsOrder');
			uni.$on('getPositonsOrder', function(data) {
				if(data.data.action=="start"){
					that.prizeList = data.data.config.prize_list
					that.isChoujiang = true;
				}else if(data.data.action=="yes_prize"){
					that.prizeList.map((item,index)=>{
						if(data.data.yes_prize_data.prize_id==item.prize_id){
							that.$refs.dialer.run(index)
						}
					})
				}
			});
		},
		onHide() {
			let that = this
			// alert(2222)
			that.isVideoLive = false
			uni.$off('getPositonsOrder');
			that.socketIo.Close(false)
			if(uni.getStorageSync('lookLive')==1){
				that.tui.TongjiLive(2, this.id)
			}

		},
		onBackPress() {
			// alert(3333)
			let that = this
			uni.$off('getPositonsOrder');
			that.socketIo.Close(false)
			that.isVideoLive = false
			if(uni.getStorageSync('lookLive')==1){
				that.tui.TongjiLive(2, this.id)
			}
		},
		onUnload() {
			let that = this
			// alert(4444)
			uni.$off('getPositonsOrder');
			that.socketIo.Close(false)
			that.isVideoLive = false
			if(uni.getStorageSync('lookLive')==1){
				that.tui.TongjiLive(2, this.id)
			}
		},
		methods: {
			
			finish(e){
				let that = this
				that.isShow = false
				if(e.type==0){
					that.payshow=false
					that.dingdanshow = true
					that.$refs.tOrderList.getList()
				}else{
					that.cjshow = true
					that.$refs.tConfirmOrder.getdata(e.order_no)
					that.$refs.tConfirmOrder.getInfo()
				}
			},
			cfmfinish(e){
				let that = this
				console.log(e)
				that.cjshow = false
				if(e.type==2){
					that.payshow = true
					that.zhifu = e.zhifu
				}else{
					that.zhiurl = e.url
					window.location.href = e.url
				}
			},
			payfinish(e){
				let that = this
				if(e.type==0){
					that.isShow=false
					that.cjshow=false
					that.payshow=false
					that.zhishow=false
				}else{
					that.payshow=false
					that.dingdanshow = true
					that.$refs.tOrderList.getList()
				}
			},
			getYao(e,d){
				let that = this
				that.tui.request("api.auth.data_user/reportLiveRoomShared", "POST", {room_id:e,inviter_code:d}, false, false, true).then((res) => {
					if(res.code==1){
						uni.setStorageSync('refCode','')
					}
				}).catch((res) => {
				
				})
			},
			
			onBack(){
				uni.switchTab({
					url:'/pages/home/home'
				})
				// uni.navigateTo({
				// 	url:'/pages/MyOrderList/MyOrderList'
				// })
			},
			onDone(index) {
				let that = this
				const prize = this.prizeList[index]
				uni.showModal({
					title: prize.type = 6 ? '很遗憾': '恭喜您',
					content: (prize.type != 6 ? `获得`:'') + prize.name,
					success: function (res) {
						if (res.confirm) {
							that.isChoujiang = false
							console.log('用户点击确定');
						} else if (res.cancel) {
							that.isChoujiang = false
							console.log('用户点击取消');
						}
					}
				})
			},
			onClick() {
				// 奖品的索引
				this.socketIo.send({"instruct":"join","ticket_id":this.ticket_id})
				// this.$refs.dialer.run(this.getRandomInt(0, 8));
			},

			getRandomInt(min, max) {
				min = Math.ceil(min); // 确保min是整数
				max = Math.floor(max); // 确保max是整数
				return Math.floor(Math.random() * (max - min + 1)) + min; // 返回介于min和max之间的整数
			},
			closeCj(){
				this.isChoujiang = false
			},
			qiandao(){
				this.tui.href('/pages/SignIn/SignIn')
			},
			getJianting(){
				let that = this
				window.addEventListener('message', function (event) {
					// 获取消息内容
					var messageEvent = event.data;
				 
					// 打印消息内容
					// 检查 messageEvent 是否存在或者是一个对象类型。
					if (!messageEvent || typeof messageEvent !== 'object') {
						// 输出错误信息 'Received invalid message event:'，并将 messageEvent 的值打印出来。
						// 返回（结束当前函数的执行）。
						return;
					}
					// 检查消息类型是否为 "vhOpenHref"，并提取URL
					if (messageEvent.type === 'vhOpenHref' && typeof messageEvent.data === 'string') {
				 
						// 在移动端浏览器上运行的逻辑
						// that.tui.href('/pages/GoodsDetails/GoodsDetails?id='+that.getParam(messageEvent.data,'id'))
						
						that.id = that.getParam(messageEvent.data,'id')
						that.$refs.tOrderDetail.getdata(that.getParam(messageEvent.data,'id'))
						that.isShow = true
						
						 // window.location.href = messageEvent.data;
				 
					} else {
						
					}
				});
			},
			getParam(path, name) {
				  var reg = new RegExp("(^|\\?|&)" + name + "=([^&]*)(\\s|&|$)", "i");   
				  if (reg.test(path))  
				  return unescape(RegExp.$2.replace(/\+/g, " ")); 
				  return "";    
			},
			getList(){
				let that = this
				let data = {}
				that.tui.request("api.auth.room/roomListAll", "POST", {page:that.page}, false, false, true).then((res) => {
					if(res.code==1){
						res.data.list.map(item=>{
							if(that.id==item.id){
								that.url = item.url
								that.ticket_id = item.ticket_id
								uni.setStorageSync('zhiboStatus',item)
								let datas_switch = uni.getStorageSync('datas_switch')
								data.title = datas_switch.scan.title
								data.desc = item.name
								data.share_img = item.cover
								uni.setStorageSync('shareZhibo', data)
								that.tui.wxShare(1,item.id)
								if(that.yaoqing){
									that.getYao(item.id,that.yaoqing)
								}
								
							}
						})
					}
				}).catch((res) => {

				})
			},
			getStatus(){
				let that = this
				that.tui.request("api.auth.center/phoneStatus", "POST", {}, false, false, true).then((res) => {
					if(res.code==1){
						if(res.data.is_phone==2){
							that.show = true
						}else{
							that.getList()
						}
					}
				}).catch((res) => {

				})
			},
		}
	}
</script>


<style lang="scss" scoped>
	.content {
		width: 100vw;
		height: 100vh;
		display: flex;
		flex-direction: column;
		.player-content {
			position: relative;
			width: 100%;
			height: 450rpx;
			display: flex;
			background-size: 100% 100%;

			.live-player {
				width: 100%;
				height: 100%;
				position: relative;
			}
		}
	}
	.back{
		position: fixed;
		right: 20rpx;
		bottom:40vh;
		display: flex;
		align-items: center;
		justify-content: center;z-index: 99999;
		width: 100rpx;
		height: 100rpx;
		// 返回
		.back-one{
			display: flex;
			align-items: center;
			justify-content: center;
			width: 50rpx;
			height: 50rpx;
			background-color: rgba(0,0,0,0.3);
			border-radius: 100%;
			text{
				display: flex;
				width: 20rpx;
				height: 20rpx;
				border-left: 2rpx solid #FFFFFF;
				border-bottom: 2rpx solid #FFFFFF;
				transform: rotate(45deg);
			}
		}
		.action{
			background-color: transparent;
			text{
				border-color: #555555;
			}
		}
	}
	//播放器弹出工具
	.player-tool {
		width: 100%;
		height: 60rpx;
		background-image: linear-gradient(0deg, rgba(0, 0, 0, .6), transparent);
		display: flex;
		align-items: center;
		justify-content: space-between;
		position: absolute;
		left: 0;
		padding: 0 45rpx;
		transition: all 0.3s;
		.tools {
			height: 100%;
			width: auto;
			display: flex;
			align-items: center;

			.full-screen {
				height: 100%;
				display: flex;
				align-items: center;
				justify-content: center;

				.iconfont {
					color: #fff;
					font-weight: bold;

				}
			}

			.cruise {
				display: flex;
				align-items: center;
				justify-content: center;
				margin-left: 25rpx;

				.iconfont {
					color: #E45A3E;
					font-size: 45rpx;
				}
			}
		}

	}
	.zhuanpan{position: fixed;top: 50%;left: 50%;width: 550rpx;height: 550rpx;margin-left: -275rpx;margin-top: -275rpx;z-index: 111;background: transparent;}
</style>
